<template>
  <div class="table">
    <v-table is-horizontal-resize
             style="width:100%"
             :columns="tableColumns"
             :table-data="tableData"
             row-hover-color="#eee"
             title-bg-color="#11c1f3"
             row-click-color="#edf7ff"
             :row-click='handleRowclick'
             :column-cell-class-name='bcellName'
             @on-custom-comp="customCompFunc"></v-table>
  </div>
</template>
<script>

import Vue from 'vue'
import Lib from '@/assets/js/Lib'
import { VTable } from 'vue-easytable'
import App from '@/assets/js/conf'
Vue.component(VTable.name, VTable)
export default {
  name: 'vtable',
  props: {
    tableColumns: {
      type: Array
    },
    tableData: {
      type: Array
    }
  },
  data: function () {
    return {    
      baseUrl: App.baseUrl,
    }
  },
  components: {
    VTable
  },
  mounted () {

  },
  methods: {
    bcellName (rowIndex, columnName, rowData) {
      if (columnName === 'doLink') {
        return 'underline'// 这是你的css名字
      }
    },
    handleRowclick (rowIndex, rowData, column) {
      let callBackData = {}
      callBackData.index = rowIndex
      callBackData.items = rowData
      callBackData.column = column
      this.$emit('handleRowclick', callBackData)
    },
    customCompFunc (params) {
      let callBackData = {}
      callBackData.items = params.rowData
      callBackData.index = params.index
      callBackData.type = params.type
      let buildingId = params.rowData.id
      if (params.type === 'unit') { // do delete operation
        // this.$router.push({ path: '/Unit', query: { 'buildingId': buildingId } })
        let token =localStorage.getItem("token")
        window.location.href = '/views/dc/unit.html?buildingId=' + buildingId + '&?token=' + token
      } else if (params.type === 'edit') { // do edit operation
        // this.$delete(this.tableData, params.index)
        this.$emit('handleRowclick', callBackData)
        // alert(`行号：${params.index} 姓名：${params.rowData['name']}`)
      }
    }
  }
}
</script>
<style scoped>
.table >>> .underline span {
  text-decoration: underline;
}
</style>
